/*
 * @Author: jingyitao
 * @Date: 2023-10-10 09:15:05
 * @Last Modified by: jingyitao
 * @Last Modified time: 2023-10-10 09:20:40
 *
 * 使用 hook 的意义之一是解决 store 和组件之间的耦合问题
 * 每次使用 react-redux 中的 hook 都需要指定 store 类型，这意味着组件与 store 存在强耦合
 * 所以一个正确的思路是: 将 RootState 的类型提取出来，从组件中剥离
 * 实现原理和思路是需要通过 react-redux 中一个叫做 TypedUseSelectorHook 的 interface 来使用定义的 store 类型重新定义 useSelector
 * 简单来说就是自定义一个 redux hook
 */
import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux';
import type { RootState, AppDispatch } from '../../store';

export const useAppDispatch = () => useDispatch<AppDispatch>();

/**
 * 自定义 useAppSelector 原封不动的等于 useSelector
 * 本质上我们没有创建任何新的 hook 只是套用了旧的 useSelector 给它加上了类型定义而已
 */
export const useAppSelector: TypedUseSelectorHook<RootState> = useSelector;
